<template>
  <base-layout>
    <template #searchPanel>
      <search-panel
        v-slot="{ form }"
        :addPer="authConfig.add"
        :selectPer="authConfig.query"
        :financePer="'111'"
        :excelPer="'admin'"
        addTitle="新增财务"
        @insert="addFinancialflowEv"
        @search="search"
        :showSearchButton="true"
        :showFinanceButton="true"
        :showExportButton="true"
        :showAddButton="true"
        @export="handleDataExport('Cost', '流水账')"
      >
        <el-date-picker v-model="form.costTime" type="datetime" placeholder="收支时间"></el-date-picker>
        <job-shop v-model="form.storeId" placeholder="所属门店" />
        <el-select clearable style="width: 200px" v-model="form.castType" placeholder="收支种类">
          <el-option v-for="item in dict.costTypeOptions" :key="item.label" :value="item.value" :label="item.label" />
        </el-select>
        <el-input v-model="form.costCode" clearable placeholder="流水编号" style="width: 200px" />
      </search-panel>
    </template>
    <template #contentPanel>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :has-action="true"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :width="160"
      >
        <template #action="{row}">
          <i class="el-icon-edit" title="编辑" style="cursor: pointer;" v-permission="authConfig.edit" @click="handleDataUpdateEdit(row)"></i>
          <i class="el-icon-delete" title="删除" style="color:red; margin-left: 20px;cursor: pointer" v-permission="authConfig.del" @click="handleDataDelete(row)"></i>
        </template>
      </data-table>
    </template>
  </base-layout>
</template>
<script>
import {
  dataList,
  details,
  addData,
  updateData,
  deleteData,
} from  '@/api/after-sale/finance/bill'
import {parseTimeToYMDHMS, exportExcel} from '@/utils/index'
import baseMixin from '@/mixins/base';
export default {
  mixins: [
    baseMixin({
      findData: dataList,
      addData: addData,
      deleteData: deleteData,
      dataName: ['content', 'totalRecords'],
      isAdd: false,
      findDataById: details,
      updateData: updateData,
      idName: 'id',
      format(res) {
        return res.map((data) => {
          data.costType = data.costType ? '收入' : '支出'
          return data
        })
      }
    })
  ],
  data() {
    return {
      authConfig: {
        query: 'cost:page',
        add: 'cost:save',
        edit: 'cost:update',
        del: 'cost:del',
      },
      tableColumnAttributes: [
        { name: '所属门店', value: 'storeName', type: 'text' },
        { name: '流水编号', value: 'costCode', type: 'text' },
        { name: '收支金额', value: 'costPrice', type: 'text' },
        { name: '收支类型', value: 'costType', type: 'text' },
        { name: '收支来源', value: 'costSource', type: 'text' },
        { name: '收支时间', value: 'costTime', type: 'text' },
        { name: '来源编号', value: 'sourceCode', type: 'text' },
        { name: '收支方式', value: 'payType', type: 'text' },
        { name: '收支账号', value: 'costAccount', type: 'text' },
        { name: '收支录入人', value: 'userName', type: 'text' },
        { name: '录入时间', value: 'createTime', type: 'text' },
        { name: '开票状态', value: 'ticketStatus', type: 'text' },
        { name: '财务审核状态', value: 'auditStatus', type: 'text' },
        { name: '备注', value: 'remark', type: 'text' }
      ],
      dict: {
        costTypeOptions: [{label: '收入', value: true},{label: '支出', value: false}],
      },
    }
  },
  methods:{
    search() {
      this.searchOptions = {
        castType: this.form.castType,
        costCode: this.form.costCode,
        costTime: this.form.costTime ? parseTimeToYMDHMS(this.form.costTime) : '',
        storeId: this.form.storeId
      };
      this.currentPage = 1
      this.setTableData()
    },
    //新增财务事件
    addFinancialflowEv(){
      this.$router.push({ path: '/financialflow/addFinancialflow' })
    },
    handleDataUpdateEdit(row){
      this.$router.push({
        path:'/financialflow/editFinancialflow',
        query:{
          id: row.id,
        }
      })
    },
    //导出
    excelInfo () {
      exportExcel("Cost", "流水账", {}, this.pageSize, this.currentPage);
    },
  }
}
</script>
